<template>
    <div>
        <h2>病房列表</h2>
        <div>
            病房名称：<input type="text" v-model="info.housenum">
            科室：<select v-model="info.keid">
                <option value="">请选择</option>
                 <option :value="item.Id" v-for="item in list">{{ item.KeName }}</option>
            </select>
            <input type="button" value="查询" class="btn btn-primary" @click="gethouse"></input>
        </div>
        <table class="table table-bordered">
            <tbody>
                <tr>
                   <td>Id</td>
                   <td>病房号(病房名称)</td>
                   <td>所属科室</td>
                   <td>床位总数量</td>
                   <td>床位状态</td>
                   <td>空床数量</td>
                   <td>病房状态</td>
                   <td>创建时间</td>
                   <td>操作</td>
                </tr>
                 <tr v-for="item in data">
                   <td>{{ item.Id }}</td>
                   <td>{{ item.HouseNum }}</td>
                   <td>{{ item.KeName }}</td>
                   <td>{{ item.Num }}</td>
                   <td>
                    <span v-if="item.State==1" style="color:green">未满</span>
                    <span v-if="item.State==0" style="color:red">已满</span>
                   </td>
                   <td>{{ item.LastNum }}</td>
                   <td>
                    <span v-if="item.StateYe==1" style="color:blue">启用</span>
                    <span v-if="item.StateYe==0" style="color:red">维修</span>
                   </td>
                   <td>{{ moment(item.CreateTime).format("YYYY-MM-DD HH:mm:ss") }}</td>
                   <td>
                    <input type="button" value="启用" v-if="item.StateYe==0" class="btn btn-success" @click="upt(item.Id,1)"></input>
                    <input type="button" value="维修" v-if="item.StateYe==1" class="btn btn-danger" @click="upt(item.Id,0)"></input>
                   </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import axios from "axios";
import moment from "moment";
import {ref,reactive,onMounted} from "vue"
import {useRoute,useRouter} from "vue-router"
import {useStore} from "@/stores/user"

const route = useRoute();
const router = useRouter();
const abc = useStore();

let list:any = ref([])

let info:any = reactive({
    keid:'',    
    housenum:''
})

let data:any = ref([])

onMounted(()=>{
    if(abc.userinfo.Id){
        getkeroom();
        gethouse();
    }
    else{
        router.push('/login')
    }
})

//病房信息
const gethouse=()=>{
    axios({
        url:'/api/YeHotels/GetHouseList',
        method:'get',
        params:info
    })
    .then(res=>{
        console.log(res);
        data.value = res.data
    })
    .catch(err=>{
        console.log(err);
        
    })
}
//科室下拉
const getkeroom=()=>{
    axios({
        url:'/api/YeHotels/GetKeRooms',
        method:'get',
    })
    .then(res=>{
        console.log(res);
        list.value = res.data
    })
    .catch(err=>{
        console.log(err);
        
    })
}

const upt=(Id:any,state:any)=>{
    var f = confirm("您确定要修改吗")
    if(f){
    axios({
        url:'/api/YeHotels/UptState',
        method:'put',
        params:{
            ids:Id.toString(),
            state:state
        }
    })
    .then(res=>{
        console.log(res);
        if(res.data>0){
            alert('修改成功');
            gethouse();
            return;
        }
        else{
            alert('修改失败');
            return;
        }
    })
    .catch(err=>{
        console.log(err);
        
    })
    }
    
}
</script>

<style scoped>
input{
    margin: 0 10px;
}
</style>